
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="csrf-token" content="{{ csrf_token() }}" />  
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>修改头像</title>
<link rel="shortcut icon" href="{{ asset('/images/favicon.ico') }}" />
<link href="{{ asset('/bootstrap/css/bootstrap.min.css') }}" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="{{ asset('css/shouye/header.css') }}"/>
<link rel="stylesheet" href="{{ asset('/css/jcrop/style.css') }}" type="text/css" />
<link rel="stylesheet" type="text/css" href="{{ asset('/css/person/person-center.css') }}"/>
<script type="text/javascript" src="{{ asset('/js/jcrop/jquery-1.11.1.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('/js/jcrop/cropbox.js') }}"></script>

<style>
        .footer{
            width: 100%;
            height: 50px;
            background: #9d9d9d;
            margin-top: 10px;
            text-align: center;
            line-height: 50px;
        }
        .footer p{
            color: #fff;
        }
		.fixed-bottom{position: fixed;bottom: 0;width:100%;}
    </style>
<script type="text/javascript">

	<!-- 2.设置全局ajax选项 -->
	$.ajaxSetup({
		headers:{
			'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
		}
	});
	
	// 获取 token
	var _token = $('meta[name="csrf-token"]').attr('content');



</script>



</head>


<body>

<!--  header  -->
<div class="v_header navbar-fixed-top" >
    
	<!-- 一 -->
    <div class="v_headerTop">
        <div class="v_headerTopB">
           
			<div class="topLtile">欢迎来到蜘蛛比分，开启您的体育之旅！</div>
            
            <div class="topLR">
				
				@if( session('user_name') )
					
					<div class="lr_f lr_f_username">
						<a class="mbile_text hovecolorl" href="{{ url('/personNal') }}">
							{{ session('user_name') }}
						</a>
						<div class="m_inbox"></div>
						<div class="mbile_hidde">
							<i><span></span></i>
							<ul>
								<li><a href="{{ url('/recharge') }}">充值中心</a></li>
								<li><a href="{{ url('/personNal') }}">个人中心</a></li>
								<li><a href="{{ url('/articleManage') }}">文章管理</a></li>
								<li><a href="{{ url('/new_article') }}">文章发表</a></li>
								<li><a href="{{ url('/mycollect') }}">我的收藏</a></li>
							</ul>

						</div>
					</div>
					
					<div class="lr_f">
						<a class="mbile_text hovecolorl" href="{{ url('/loginOut') }}">退出</a>
						<div class="m_inbox"></div>
					</div>
				
				@else
					
					<div class="lr_f">
						
						<a type="button" id="loginLogin" class="mbile_text hovecolorl" data-toggle="modal" data-target="#login"> 登陆 </a>
						<div class="m_inbox"></div>
						
						<a type="button" id="regLogin" class="mbile_text hovecolorl" data-toggle="modal" data-target="#login">&nbsp;&nbsp; | &nbsp;&nbsp; 注册 </a>
						<div class="m_inbox"></div>
						
						<a type="button" id="articlelogin" class="mbile_text hovecolorl" data-toggle="modal" data-target="#login">&nbsp;&nbsp; | &nbsp;&nbsp;发表文章</a>
						<div class="m_inbox"></div>
						
						@include('common.login')
						
					</div>
					
				@endif
				
            </div>
        </div>
    </div>
    
   
	<!-- 二 -->
    <div class="v_headerBottom">
        
		<div class="v_headbox">
            
			<!-- logo -->
			<div class="homeicoo">
				<a href='{{ url('/') }}' >
					<img src="{{ asset('/images/logo.jpg') }}" style="width:95%;" />
				</a>
            </div>

			<!-- 导航 -->
            <div class="homenav">
                <ul>
                    <li id="index" >
                        <a href="{{ url('/') }}">首页</a>
                    </li>
                    <li>
                        <a href="{{ url('/news/list') }}">资讯</a>
                    </li>
                    <li>
                        <a href="{{ url('/photoList') }}">图库</a>
                    </li>
					<li>
                        <a href="{{ url('/footClub') }}">球吧</a>
                    </li>
					<li>
						<i></i>
                        <a href="{{ url('/recommendlist') }}">推荐</a>
                    </li>
					<li>
						<i class="nav_last"></i>
                        <a href="{{ url('/database') }}">资料库</a>
                    </li>
					
                </ul>
            </div>
			<!-- 搜索框 -->
		   <div class="header-seach">				
				<div class="col-lg-12" style="padding:0">
					<div class="input-group">
						
						<span class="input-group-btn">
							<select name="selectType" class="btn btn-default" style="width:70px;height:40px;padding:3px">
								@if( session('commonSelect') && session('commonSelect')=='1' )
									<option value="1" selected >资讯</option>
									<option value="2" >球吧</option>
								@elseif( session('commonSelect') && session('commonSelect')=='2' )
									<option value="1"  >资讯</option>
									<option value="2" selected >球吧</option>
								@else
									<option value="1" >资讯</option>
									<option value="2" >球吧</option>
								@endif
								
							</select> 
						</span>
						
						<!-- {{ session('commonSearch') }} -->
						<form method="post" id="commonForm" action="{{ url('/news/list') }}"   >
							
							{{ csrf_field() }}
							<input type="text" name="keyTitle" class="form-control" autocomplete="off" placeholder="请输入相关标题进行查找..." value="" style="height:40px" />
							
						</form>
						
						<span class="input-group-btn">
							<button id="search" class="btn btn-default" type="button"  style="height:40px;  font-weight: normal;">搜索</button>
						</span>
					</div><!-- /input-group -->
				  </div><!-- /.col-lg-6 -->
        </div>
  

        </div>
    </div>
    
	   
</div>

<!--面包屑导航-->
<div style="width: 1200px;height: 40px;line-height:40px;position: relative;margin: 110px auto 0;font-size:12px">
    <ol style="float: left;overflow: hidden;color: #333;list-style: none;">
        <li style="float: left;margin-left: 5px">当前位置：</li>
        <li style="float: left;margin-left: 5px"><a href="/" style="color: #de1e30;margin-left: 5px">首页</a>
        </li>
        <li style="float: left;margin-left: 5px"><a href="{{ url('/personNal') }}" style="color: #de1e30;margin-left: 5px">>
            个人中心</a></li>
		<li style="float: left;margin-left: 5px">> 修改头像</li>
       
    </ol>
</div>

<div id="picInfo" style="display:none;position:fixed;top:112px;left:512px;z-index:1024;border:1px solid red;width:796px;height:40px;text-align:center;font-size:17px;padding-top:8px;color:white;background:#de1e30;"></div>

<div class="wrap" style="margin-top:10px;overflow:hidden;">
    
	<!--发文 管理标题-->
    <div class="left_menu">
        <div class="menu_block admin">
            <a href="{{ url('/personNal') }}" class="menu_article">
                <i></i>
                我的资料
            </a>
			
        </div>
		<div class="menu_block admin_change_img" style="background:#eee">
            <a href="{{ url('/changuserpic') }}" class="menu_article">
                <i></i>
                修改头像
            </a>
			
        </div>
		<div class="menu_block admin-focus">
            <a href="{{ url('/myfans') }}" class="menu_article">
                <i></i>
                我的关注
            </a>
        </div>
		<div class="menu_block article-manage">
			<a href="{{ url('/articleManage') }}" class="menu_article">
				<i></i>
				文章管理
			</a>
		</div>
		<div class="menu_block menu_recharge">
            <a href="{{ url('/recharge') }}" class="menu_article">
                <i></i>
                充值中心
            </a>
        </div>
		<div class="menu_block menu_recharge">
            <a href="{{ url('/recharge_record') }}" class="menu_article">
                <i></i>
                充值记录
            </a>
        </div>
		<div class="menu_block article-colle">
			<a href="{{ url('/mycollect') }}" class="menu_article">
				<i></i>
				我的收藏
			</a>
		</div>
        <div class="menu_block article-publi">
            <a href="{{ url('/new_article') }}" class="menu_article">
                <i></i>
                发表文章
            </a>
        </div>
		<div class="menu_block article-recommend">
            <a href="{{ url('/recommendgame') }}" class="menu_article">
                <i></i>
                竞彩推荐
            </a>
        </div>
    </div>
	
	<!--修改 头像-->
	<div class="right_main">
		<div class="container">
			<div class="imageBox">
				<div class="thumbBox"></div>
				<div class="spinner" style="display: none">请选择图片...</div>
			</div>
		  
			<div class="action"> 
				<!-- <input type="file" id="file" style=" width: 200px">-->
				<div class="new-contentarea tc" style="cursor:pointer;" > 
					<a href="javascript:void(0)" class="upload-img" >
						<label for="upload-file">上传图像</label>
					</a>
					<input type="file"  name="upload-file" style="cursor:pointer;" id="upload-file" />
				</div>
				<input type="button" id="btnCrop"  class="Btnsty_peyton" style="cursor:pointer;" value="保存">
				<input type="button" id="btnZoomIn" class="Btnsty_peyton" style="cursor:pointer;" value="+"  >
				<input type="button" id="btnZoomOut" class="Btnsty_peyton" style="cursor:pointer;" value="-" >
			</div>
		  
			<div class="cropped"></div>
		  
		</div>
	</div>
</div>
<!--footer-->
<div style="background: #9d9d9d;height:50px;width:100%;margin-top:50px;" id="footer">
	<div class="footer">
		<p>Copyright © 2017 Zhi Zhu 版权所有</p>
	</div>
</div>
<!--footer始终在底部-->
<script>
$(function(){
    function footerPosition(){
        $("#footer").removeClass("fixed-bottom");
        var contentHeight = document.body.scrollHeight,//网页正文全文高度
            winHeight = window.innerHeight;//可视窗口高度，不包括浏览器顶部工具栏
        if(!(contentHeight > winHeight)){
            //当网页正文高度小于可视窗口高度时，为footer添加类fixed-bottom
            $("#footer").addClass("fixed-bottom");
        } else {
            $("#footer").removeClass("fixed-bottom");
        }
    }
    footerPosition();
    $(window).resize(footerPosition);
});
</script>


<script type="text/javascript">

	function showerror(info)
	{
		$("#picInfo").html('');
		$("#picInfo").html(info);
		$("#picInfo").slideDown();
		setTimeout(function(){
			$("#picInfo").slideUp();
		},2000)
	}
		
$(window).load(function() {
	var options =
	{
		thumbBox: '.thumbBox',
		spinner: '.spinner',
		imgSrc: "{{ asset('/images/login/login.png') }}"
	}
	var cropper = $('.imageBox').cropbox(options);
	// 上传图片按钮
	$('#upload-file').on('change', function(){
		var reader = new FileReader();
		reader.onload = function(e) {
			options.imgSrc = e.target.result;
			cropper = $('.imageBox').cropbox(options);
		}
		reader.readAsDataURL(this.files[0]);
		this.files = [];
	})
	// 点击裁切
	$('#btnCrop').on('click', function(){
		var img = cropper.getDataURL();
		$('.cropped').html('');
		$('.cropped').append('<img src="'+img+'" align="absmiddle" style="width:180px;margin-top:40px;border-radius:180px;box-shadow:0px 0px 12px #7E7E7E;">');
		
		$.ajax({
			url:"{{ url('jcrop') }}",
			type:"post",
			async: false,
			dataType:'json',
			data:{newphoto:img,_token:_token},
			success:function(back)
			{
				
				
				$("#picInfo").html('');
				$("#picInfo").html(back['show_info']);
				$("#picInfo").slideDown();
				setTimeout(function(){
					$("#picInfo").slideUp();
				},2000);
				if( back['show_info']=='修改头像成功' )
				{
					setTimeout(function(){
						location.href="{{ url('/personNal') }}";
					},1000);
					
				}
				
			}
		});
	})
	// 缩小
	$('#btnZoomIn').on('click', function(){
		cropper.zoomIn();
	})
	// 放大
	$('#btnZoomOut').on('click', function(){
		cropper.zoomOut();
	})
});
</script>
</body>
</html>
